﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>down3-ligerui演示页面</title>    
    <!--ligerui-->
    <link rel="stylesheet" type="text/css" href="res/ligerui/ligerUI/skins/Aqua/css/ligerui-all.css" />
    <link rel="stylesheet" type="text/css" href="res/ligerui/ligerUI/skins/Gray/css/all.css" />
    <script type="text/javascript" src="res/ligerui/jquery/jquery-1.9.0.min.js"></script>
    <script type="text/javascript" src="res/ligerui/ligerUI/js/ligerui.all.js"></script>
    <script type="text/javascript" src="res/ligerui/jquery.cookie.js"></script>
    <script type="text/javascript" src="res/json2.min.js" charset="utf-8"></script>
    <script type="text/javascript" src="res/knockout.js" charset="utf-8"></script>
    <!--down2-->
    <link rel="stylesheet" type="text/css" href="res/down3/down.css" />
    <script type="text/javascript" src="res/down3/down.file.js" charset="utf-8"></script>
    <script type="text/javascript" src="res/down3/down.folder.js" charset="utf-8"></script>
    <script type="text/javascript" src="res/down3/down.edge.js" charset="utf-8"></script>
    <script type="text/javascript" src="res/down3/down.app.js" charset="utf-8"></script>
    <script type="text/javascript" src="res/down3/down.js" charset="utf-8"></script>
    <script type="text/javascript" src="res/demo.js" charset="utf-8"></script>
    <script language="javascript" type="text/javascript">
    
	    $.ligerDefaults.Grid.formatters['format_control'] = function (num, column) {
	        return '下载';
	    }
	    $.ligerDefaults.Grid.formatters['format_type'] = function (num, column) {
	        return num ? '<img src="res/down3/imgs/16/folder1.png" title="文件夹"/>':'<img src="res/down3/imgs/16/file1.png" title="文件"/>';
	    }
	
	  	//根路径：http://localhost/api/down3/
        var pos = window.location.href.lastIndexOf("/")+1;
        var api = [
            window.location.href.substr(0, pos),
            "api/down3/"
        ].join("");
	    
	    function PageApp(){
	        var _this = this;
	        this.data={
	            downCur:null,
	            sels:[],
	            downer: new DownloaderMgr(
                    {
                        config: {
                        	Folder: "",
                        	License2: "",//授权码
                            //赋加字段，业务逻辑字段
                            Fields: { uid: "0" },
                            //后端接口-文件
                            "UrlCreate": api+"f_create.jsp",
                            "UrlDel": api+"f_del.jsp",
                            "UrlList": api+"f_list.jsp",
                            "UrlListCmp": api+"f_list_cmp.jsp",
                            "UrlUpdate": api+"f_update.jsp",
                            "UrlDown": api+"f_down.jsp",
                            //后端接口-文件夹
                            "UrlFdCreate": api+"fd_create.jsp",
                            "UrlFdPage": api+"fd_page.jsp"
                        },
                        event:
                        {
                            ready: function () {
                                _this.load_files();//加载未完成列表
                            },
                            folderSel: function () {
                                _this.down_folderSel();
                            },//自动下载
                            fileAppend: function (f) {
                                _this.down_fileAppend(f);
                            }
                        },
                        ui: { render: "downDiv" }
                    }
                )
	        };
	        this.ui={
	            table:null,
	            btn:{
	                downs:null/*批量下载按钮*/
	            },
	            down:{
	                panel:null/*下载面板*/,
	                dlg:null/*弹出窗口*/
	            }
	        };
	
	        //methods
	        this.toolbar_downs_click = function(){
	            if (_this.data.downer.Config["Folder"] == "") { _this.data.downer.openConfig(); return; }
	
	            $.each(_this.data.sels,function(i,n){
	                _this.data.downer.addTask(n);
	            });
	            _this.data.sels.length=0;
	        };
	        this.toolbar_open_click = function(){
	            this.open_down_dlg();
	        };
	        this.toolbar_click = function(it){
	            if(it.text=="批量下载") _this.toolbar_downs_click();
	            if(it.text=="打开面板") _this.toolbar_open_click();
	        };
	        this.down_folderSel = function(){
	            setTimeout(function(){
	                if(_this.data.downCur!=null) _this.data.downer.addTask(_this.data.downCur);
	                _this.data.downCur = null;
	
	                $.each(_this.data.sels,function(i,n){
	                    _this.data.downer.addTask(n);
	                });
	                _this.data.sels.length=0;
	            },100);
	        };
	        this.down_fileAppend = function(f){
	            this.open_down_dlg();
	            setTimeout(function(){
	                _this.data.downer.start_queue();
	            },100);
	        };
	        this.load_files_cmp = function(fs){
	            //初始化表格
	            app.ui.table = $("#filegrid").ligerGrid({
	                checkbox: true,//复选框支持
	                toolbar:{items:[
	                        {text:"批量下载",click:app.toolbar_click,img:'res/down3/imgs/16/down.png'},
	                        {text:"打开面板",click:app.toolbar_click,img:'res/down3/imgs/16/show.png'}
	                    ]},
	                columns: [
	                    { display: '类型', name: 'fdTask', align: 'left', width: 40, type:'format_type' },
	                    { display: '名称', name: 'nameLoc', align: 'left' },
	                    { display: '文件大小', name: 'sizeSvr', align: 'right',width: 50 }
	                ],
	                width:600,
	                pageSize:30 ,
	                rownumbers:true,
	                data:{Rows:fs},
	                onCheckAllRow:function (ck){
	                    _this.data.sels.length = 0;
	                    if(ck)
	                    {
	                        var rows = _this.ui.table.getCheckedRows();
	                        $.each(rows,function(i,n){
	                        	var pv = $.extend({},n,{fileUrl:_this.data.downer.Config.UrlDown});
	                            _this.data.sels.push(pv);
	                        });
	                    }
	                },
	                onCheckRow: function (checked, data, rowindex, rowobj)
	                {
	                    _this.data.sels.length = 0;
	                    var rows = _this.ui.table.getCheckedRows();
	                    $.each(rows,function(i,n){
	                    	var pv = $.extend({},n,{fileUrl:_this.data.downer.Config.UrlDown});
	                        _this.data.sels.push(pv);
	                    });
	                }
	            });
	        };
	        this.load_files = function(){
	            $.ajax({
	                type: "GET"
	                , dataType: 'jsonp'
	                , jsonp: "callback" //自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名
	                , url: this.data.downer.Config["UrlListCmp"]
	                , data: { uid: this.data.downer.Config.Fields["uid"], time: new Date().getTime() }
	                , success: function (msg)
	                {
	                    if (msg.value == null)
	                    {
	                        $("#msg_load").hide();
	                        return;
	                    }
	
	                    var files = JSON.parse( decodeURIComponent(msg.value) );
	                    app.load_files_cmp(files);//
	                }
	                , error: function (req, txt, err) { alert("加载上传数据失败！" + req.responseText); }
	                , complete: function (req, sta) { req = null; }
	            });
	        };
	        this.open_down_dlg = function (){
	            this.ui.down.panel.show();
	            if(this.ui.down.dlg == null)
	            {
	                this.ui.down.dlg = $.ligerDialog.open({
	                    width:462,
	                    height:522,
	                    target:this.ui.down.panel,
	                    showMax:false,
	                    showMin:false,
	                    slide:false,
	                    modal:false,
	                    isResize:true
	                });
	            }
	            else{
	                this.ui.down.dlg.show();
	            }
	        };
	
	        this.ready = function(){
	            this.ui.down.panel = $("#downDiv");
	            this.ui.down.panel.hide();
	
	            ko.applyBindings(_this);
	        };
	    }
	    var app = new PageApp();
	
	    $(function(){
	        app.ready();
	    });
    </script>
    <style type="text/css">
        h4 {
            margin: 0;
        }

        p {
            font: 9pt 宋体;
        }

        ul {
            list-style-type: none;
            font: 9pt 宋体;
        }

            ul li {
                display: inline;
                margin: 0 5px 0 0;
                font: 9pt 宋体;
            }
    </style>
</head>
<body>
    <p>此页为下载控件演示页面，与up7配合使用。可以下载up7数据库中的文件和文件夹</p>
    <div id="demos"></div>
    <div id="filegrid"></div>
    <div id="downDiv"></div>
    <div id="msg"></div>
</body>
</html>